import 'package:flutter/material.dart';
import 'package:interview/theme/app_colors.dart';
import 'package:pull_to_refresh/pull_to_refresh.dart';

class RecordPlay extends StatelessWidget {
  final AppColors theme;
  final bool isRecording;
  final VoidFutureCallBack stopRecording;
  final VoidFutureCallBack startRecording;
  const RecordPlay({
    super.key, 
    required this.theme, 
    required this.isRecording, 
    required this.stopRecording, 
    required this.startRecording
  });

  @override
  Widget build(BuildContext context) {
    return  Row(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        GestureDetector(
          onTap: isRecording ? stopRecording : startRecording,
          child: Stack(
            alignment: Alignment.center,
            children: [
              // 外部黑色边框
              Container(
                width: 56,
                height: 56,
                decoration: BoxDecoration(
                  color: Colors.transparent,
                  border: Border.all(
                    color: theme.contrastPure!,
                    width: 2.4,
                  ),
                  borderRadius: BorderRadius.circular(50),
                ),
              ),
              // 内部红色容器
              AnimatedContainer(
                duration: const Duration(milliseconds: 300),
                width: isRecording ? 32 : 48,
                height: isRecording ? 32 : 48,
                decoration: BoxDecoration(
                  color: Colors.red,
                  borderRadius: BorderRadius.circular(isRecording ? 4 : 50),
                ),
              ),
            ],
          ),
        ),
      ],
    );
  }
}